"use strict";

/**
 * @auther wtfssd
 * Created by wtfssd on 2018/1/16
 */
import * as React from 'react'
import {autoSize, commonProps, commonStyles} from "../../assets/styles/common";
import NavBackButton from "../../component/BackButton";
import Colors from "../../assets/styles/Colors";
import MyImage from "../../component/MyImage";
import Request from "../../utils/Request";
import {CompanyPage} from "../../interface/router";
import {SCREEN_WIDTH} from "../../constant";
import WhiteSpace from "../../component/WhiteSpace";
import MyText from "../../component/MyText";
import T from "../../utils/T";
import MyIcon from "../../component/icon";
import {openUrl} from "../../utils/tools";

const {View, ScrollView, TouchableOpacity} = require('react-native');
const {connect} = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
const {Actions} = require("react-native-router-flux");

class Page extends React.Component<CompanyPage, any> {


    onItemPress = (url,inApp=false) => {
        if (url && url !== '暂无') {
            openUrl(url,inApp)
        }
    };

    render() {
        return (
            <View style={[commonStyles.container]}>
                <NavigationBar {...commonProps.navBar}
                               leftButton={<NavBackButton/>}
                               title={{title: this.props.company.name, tintColor: Colors.White}}
                />
                <ScrollView>
                    <MyImage source={{uri: Request.checkImageUrl(this.props.company.pic)}}
                             size={{width: SCREEN_WIDTH, height: autoSize(300)}}
                             style={{backgroundColor: Colors.Active}}
                    />
                    <View style={[commonStyles.listItem, commonStyles.underLine, commonStyles.topLine, {
                        justifyContent: 'space-between',
                        paddingVertical: 15
                    }]}>
                        <MyText>{T('Name')}</MyText>
                        <MyText>{this.props.company.name}</MyText>
                    </View>
                    <View style={[commonStyles.listItem, commonStyles.underLine, {
                        justifyContent: 'space-between',
                        paddingVertical: 15
                    }]}>
                        <MyText>{T('Address')}</MyText>
                        <MyText>{this.props.company.address}</MyText>
                    </View>
                    <View style={[commonStyles.underLine, {paddingVertical: 15, paddingHorizontal: 5}]}>
                        <MyText>{T('Description')}</MyText>
                        <MyText style={{marginTop: 5}}>{this.props.company.business}</MyText>
                    </View>
                    <WhiteSpace/>
                    <TouchableOpacity onPress={this.onItemPress.bind(this, this.props.company.website.indexOf('http')==-1?`http://${this.props.company.website}`:this.props.company.website)}
                                      style={[commonStyles.listItem, commonStyles.relative, commonStyles.underLine, commonStyles.topLine, {
                                          justifyContent: 'space-between',
                                          paddingVertical: 15
                                      }]}>
                        <MyText>{T('HomePage')}</MyText>
                        <MyText style={{marginRight: 25}}>{this.props.company.website || '暂无'}</MyText>
                        <View style={[commonStyles.absolute, {right: 10, top: 12, backgroundColor: 'transparent'}]}>
                            <MyIcon name={'icon-iconfontyoujiantou'} color={Colors.Brief} size={25}/>
                        </View>
                    </TouchableOpacity>
                    <TouchableOpacity onPress={this.onItemPress.bind(this, `tel:${this.props.company.tel}`)}
                                      style={[commonStyles.listItem, commonStyles.relative, commonStyles.underLine, {
                                          justifyContent: 'space-between',
                                          paddingVertical: 15
                                      }]}>
                        <MyText>{T('Tel')}</MyText>
                        <MyText style={{marginRight: 25}}>{this.props.company.tel || '暂无'}</MyText>
                        <View style={[commonStyles.absolute, {right: 10, top: 12, backgroundColor: 'transparent'}]}>
                            <MyIcon name={'icon-iconfontyoujiantou'} color={Colors.Brief} size={25}/>
                        </View>

                    </TouchableOpacity>
                    <TouchableOpacity onPress={this.onItemPress.bind(this, `mailto:${this.props.company.email}`)}
                                      style={[commonStyles.listItem, commonStyles.relative, commonStyles.underLine, {
                                          justifyContent: 'space-between',
                                          paddingVertical: 15
                                      }]}>
                        <MyText>{T('Email')}</MyText>
                        <MyText style={{marginRight: 25}}>{this.props.company.email || '暂无'}</MyText>
                        <View style={[commonStyles.absolute, {right: 10, top: 12, backgroundColor: 'transparent'}]}>
                            <MyIcon name={'icon-iconfontyoujiantou'} color={Colors.Brief} size={25}/>
                        </View>

                    </TouchableOpacity>
                </ScrollView>
            </View>
        );
    }
}


export default connect()(Page);